<ion-header>
  <ion-navbar>
    <ion-title>
      液压驱动电梯
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content class="hydpress">
  <div>
    <ion-segment [(ngModel)]="mainceType" (ionChange)="segmentChanged($event)">
      <ion-segment-button value="1" disabled="true" [ngClass]="{'active':mainceType==1}" *ngIf="getType>=1">
        第一步
      </ion-segment-button>
      <ion-segment-button value="2" disabled="true" [ngClass]="{'active':mainceType==2}" *ngIf="getType>=2">
        第二步
      </ion-segment-button>
      <ion-segment-button value="3" [ngClass]="{'active':mainceType==3}" disabled="true" *ngIf="getType>=3">
        第三步
      </ion-segment-button>
      <ion-segment-button value="4" [ngClass]="{'active':mainceType==4}" disabled="true" *ngIf="getType>=4">
        第四步
      </ion-segment-button>
    </ion-segment>
  </div>
  <div class="bar">
    <div>
      <img src="assets/icon/ic_√_select.png">
      <span>已经保养</span>
    </div>
    <div>
      <img src="assets/icon/ic_×_select.png">
      <span>需要更换/无此项</span>
    </div>
    <div>
      <img src="assets/icon/ic_no_select.png">
      <span>无此项</span>
    </div>
  </div>
  <div [ngSwitch]="mainceType">
    <div *ngSwitchCase="1">
      <hydpress-half (next)="doNext($event)" (back)="doBack($event)" [inValue]="param"></hydpress-half>
    </div>
    <div *ngSwitchCase="2">
      <hydpress-quarter (next)="doNext($event)" (back)="doBack($event)" [inValue]="param"></hydpress-quarter>
    </div>
    <div *ngSwitchCase="3">
      <hydpress-half-year (next)="doNext($event)" (back)="doBack($event)" [inValue]="param"></hydpress-half-year>
    </div>
    <div *ngSwitchCase="4">
      <hydpress-year (next)="doNext($event)" (back)="doBack($event)" [inValue]="param"></hydpress-year>
    </div>
  </div>

</ion-content>